﻿{namespace dce=ArminVieweg\Dce\ViewHelpers}
<f:layout name="Default" />

<f:section name="main">
	<div class="c-content-box c-size-md c-no-bottom-padding c-overflow-hide">
                <div class="c-container">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="c-content-title-1">
                                <h3 class="c-font-34 c-font-center c-font-bold c-font-uppercase c-margin-b-30"> {field.title}</h3>
                                <div class="c-line-center c-theme-bg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="c-content-tab-2 c-theme c-opt-1">
                                <ul class="nav c-tab-icon-stack c-font-sbold c-font-uppercase">
									<f:for each="{field.contentblock}" as="vo" iteration="itemIteration">
										<li class="{f:if(condition:'{itemIteration.isFirst}', then:'active')}" style="margin:0 10px;">
                                        <a href="#c-tab2-opt1-{itemIteration.cycle}" data-toggle="tab" style="min-width:141px;">
                                            <span class="c-content-line-icon c-icon-{vo.style}"></span>
                                            <span class="c-title">{vo.headline}</span>
                                        </a>
                                        <div class="c-arrow"></div>
                                    	</li>
                                    </f:for>
                                </ul>
                                <div class="c-tab-content">
                                    <div class="c-bg-img-center1">
                                        <div class="container">
                                            <div class="tab-content">
											  <f:for each="{field.contentblock}" as="vo" iteration="itemIteration">
												<div class="tab-pane fade in {f:if(condition:'{itemIteration.isFirst}', then:'active')} " id="c-tab2-opt1-{itemIteration.cycle}">
                                                    <div class="c-tab-pane">
														<f:image src="uploads/pics/{vo.image}" width="400c" height="300c" alt=""  class="img-responsive"  />
                                                        <h4 class="c-font-30 c-font-thin c-font-uppercase c-font-bold">{vo.topic}</h4>
                                                        <p class="c-font-17 c-margin-b-20 c-margin-t-20 c-font-thin "> {vo.content}</p>
														<f:link.typolink parameter="{vo.link}"  class="btn btn-sm c-theme-btn c-btn-square c-btn-bold"   additionalAttributes="{type:'button'}">
                                                           {vo.linkcontent}
                                                        </f:link.typolink>
                                                    </div>
                                                </div>
												 </f:for>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
</f:section>